<template>
  <div ref="protocolPage" class="agreementPrivacy">
    <div v-html="privacy" class="content"></div>
  </div>
</template>

<script>
// import Hybrid from '@/components/uzone-hybrid';

export default {
  name: 'agreementPrivacy',
  data () {
    return {
      privacy: '',
      hasNotice: false,
    };
  },
  methods: {
    /**
     * 初始化 外部打开协议页面的情况
     */
    init() {
      const user = this.$storage.get('user');
      if (!user) {
        this.$storage.set('user', { code: '' });
        this.getPrivacy();
      } else {
        this.getPrivacy();
      }
    },
    /**
     * 获取协议内容
     */
    getPrivacy() {
      console.warn('privance')
      const params = {
        systemName: 'app',
        module: 'app_setting',
        function: 'privacy_protocol',
        key: 'privacy_protocol',
        status: '0',
      };
      this.$api.getAppSettingOne(params).then(res => {
        const { status, error, data } = res;
        if ('1' === status && ('00000000' === error || '0000' === error) && data) {
          this.privacy = data.value;
          this.$nextTick(() => {
            this.listenScroll();
          });
        }
      });
    },
    noticeBottom() {
      // 通知APP，页面已经滚动到底部，阅读完成，通知一次
      if (!this.hasNotice) {
        this.hasNotice = true;
        // const hybrid = new Hybrid(this.$os.android ? 'android' : 'ios');
        this.$hybrid.action('scrollBottom', { scrollBottom: true });
      }
    },
    listenScroll() {
      const page = this.$refs.protocolPage;
      const winHeight = window.innerHeight;
      const scrollTop = document.scrollingElement.scrollTop;
      if (scrollTop + winHeight + 20 >= page.clientHeight) {
        this.noticeBottom();
      }
      window.addEventListener('scroll', () => {
        const scrollTop = document.scrollingElement.scrollTop;
        if (scrollTop + winHeight + 20 >= page.clientHeight) {
          this.noticeBottom();
        }
      });
    },
  },
  created() {
    this.init();
  }
};
</script>

<style lang="scss">
@import './index..scss';
</style>
